﻿//*************************************************************************************
// File     : studio_observer.js
// Requires : jquery.js (version 1.2.6+), Boogaloo.js, braingnat.js
// Author   : Kyle Weems (ksw)
// Origin   : mindfly.com
// Created  : Mar 31, 2009
// Modified : May 19, 2010
// Purpose  : Script for entire boogaloo admin that listens for certain events.
//*************************************************************************************

// launches various functions on page load.
$(document).ready(function() {
    launchHostNavigation();
    checkDomain();
    pageTypeMenu();
    revealPanel();
    addDirectoryBrowsing('.fileBrowse');
    addDirectoryBrowsing('.htbBrowse input[type="text"]');
    toggleContentControl();
    togglePageSettingsCategories();
    sitemapFunctions();
    toggleTreeMenu();
    setScrollerFrameWidth();
    breadcrumbLoadSlide();
    slideButtons();
    addANewPageLoad();
    settingsInfoIcon();
    Boogaloo.initAjaxFixes();
    Boogaloo.Manip.bindHiddenTextBoxes('.spnHiddenTextBox');
    Boogaloo.addUpdatePanelFunction(function() { checkDomain(); });
    Boogaloo.addUpdatePanelFunction(function() { Boogaloo.Manip.bindHiddenTextBoxes('.spnHiddenTextBox'); });
    Boogaloo.addUpdatePanelFunction(function() { addDirectoryBrowsing('.fileBrowse'); });
    Boogaloo.addUpdatePanelFunction(function() { addDirectoryBrowsing('.htbBrowse input[type="text"]'); });
    Boogaloo.addUpdatePanelFunction(function() { toggleContentControl(); });
    Boogaloo.addUpdatePanelFunction(function() { togglePageSettingsCategories(); });
    Boogaloo.addUpdatePanelFunction(function() { toggleTreeMenu(); });
    Boogaloo.addUpdatePanelFunction(function() { setScrollerFrameWidth(); });
    Boogaloo.addUpdatePanelFunction(function() { breadcrumbLoadSlide(); });
    Boogaloo.addUpdatePanelFunction(function() { slideButtons(); });
    Boogaloo.addUpdatePanelFunction(function() { settingsInfoIcon(); });
});

// addDirectoryBrowsing() - Checks to see what kind of File Manager link exists in the header's file manager button, and assigns that href to the browse buttons on the rest of the page.
function addDirectoryBrowsing(elem) {
    var opener = $('.section.main h2 .opener').attr('href');
    if(opener) {
        if (opener.indexOf("mcFileManager") != -1) {
            var pieces = opener.split("(");
            for (i = 0; i < $(elem).length; i++) {
                var hrefInsert = pieces[0] + "('aspnetForm', '" + $(elem + ":eq(" + i + ")").attr("id") + "'" + pieces[1];
                var insertion = '<a href="' + hrefInsert + '">[Browse]</a>';
                $(elem + ":eq(" + i + ")").after(insertion);
            }
        }
    }
} // end of addDirectoryBrowsing()


// toggleContentControl - Toggles the opening and closing of content controls in a page.
function toggleContentControl() {
    $('li.liContentControl h4 a').bind('click', function() {
        Boogaloo.addUpdatePanelFunction(function() {
            $('.active').removeClass('active');
            $(this).parent().parent().addClass('active');
        });
    });
} // end of toggleContentControl() 

// togglePageSettingsCategories() - Controls the opening and closing the page setting categories.
function togglePageSettingsCategories() {
    var index = Boogaloo.dictionary.retrieve("openPageSettings");
    if (index != null) {
        $('.settingCategory h4:eq(' + index + ')').addClass('active');
        document.body.className += ''; // Fixes IE bug where it doesn't sense DOM change
    }
    $('.settingCategory h4').bind('click', function() {
        $(this).siblings('.categoryContents').slideToggle();
        if ($(this).hasClass('active')) {
            $(this).removeClass('active');
            document.body.className += ''; // Fixes IE bug where it doesn't sense DOM change
            Boogaloo.dictionary.add('openPageSettings', null, true);
        } else {
            $('h4.active').removeClass('active');
            $(this).addClass('active');
            document.body.className += ''; // Fixes IE bug where it doesn't sense DOM change
            Boogaloo.dictionary.add('openPageSettings', $('.settingCategory h4').index(this), true);
        }
    });
} // end of togglePageSettingsCategories()

// pageTypeMenu() - toggles the page type list open and closed.
function pageTypeMenu() {
    $('#pageTypeList .selected').live('click', function() {
        $(this).parent().toggleClass('switch');
        $('.pagePreview').toggleClass('hide');
    });
} // end of pageTypeMenu()

// revealPanel() - This adds functionality to .reveal.button elements so that when clicked, they either open
// or close the most closely related .reveal.panel element.
function revealPanel() {
    $('.reveal.button').live('click', function() {
        if ($('.reveal.panel').length < 2) {
            $('.reveal.panel').slideToggle();
        } else {
            if ($(this).siblings('.reveal.panel').length > 0) {
                $(this).siblings('.reveal.panel').slideToggle();
            } else if ($(this).parent().siblings('.reveal.panel').length > 0) {
                $(this).parent().siblings('.reveal.panel').slideToggle();
            } else if ($(this).parent().parent().siblings('.reveal.panel').length > 0) {
                $(this).parent().parent().siblings('.reveal.panel').slideToggle();
            }
        }
    });
    $('.reveal.panel .close').live('click', function() {
        $(this).parents('.reveal.panel').slideToggle();
    });
} // end of revealPanel()

// launchHostNavigation() - Toggle the opening and closing of the host box when the settings icon is clicked.
function launchHostNavigation() {
    $('.hostTitle').bind('click', function() {
        $('#hostBox').slideToggle();
        $('.hostTitle').toggleClass('opened');
    });
    $('#hostBox .close').bind('click', function() {
        $('#hostBox').slideToggle();
    });
} // end of launchHostNavigation()

// siteMapFunctions() - binds the sitemap to open/close when its button is clicked.
function sitemapFunctions() {
    $('.sitemap .open').live('click', function() {
        $('#treeScrollerFrame').css('width', '2000px');
        $('#treeScroller').slideToggle();
        setScrollerFrameWidth();
        if ($('.sitemap').hasClass('opened')) {
            $('.sitemap').removeClass('opened');
            Boogaloo.dictionary.add('openTree', "false", true);
        } else {
            $('.sitemap').addClass('opened');
            Boogaloo.dictionary.add('openTree', "true", true);
        }
    });
} // end of siteMapFunctions()

// toggleTreeMenu() - Opens the tree menu and sets it to the right level in the sitemap
function toggleTreeMenu() {
    var sliderMargin = Boogaloo.dictionary.retrieve("sliderMargin");
    if (sliderMargin != null) {
        $('#treeScrollerFrame').css("margin-left", sliderMargin);
        $('.sitemapBreadcrumb').css("margin-left", sliderMargin);
    }
    var open = Boogaloo.dictionary.retrieve("openTree");
    if (open != null) {
        if (open == "true") {
            $('.sitemap').addClass('opened');
            setScrollerFrameWidth();
        }
    }
} // end of toggleTreeMenu()

// checkDomain() - check if the new domain name being entered already exists. If it does, warn the user.
function checkDomain() {
    $('.txtDomainName').bind('keyup', function(e) {
        Boogaloo.ScriptService.domainExists($(this).val(), function(results) {
            if (results == true) {
                $('.txtDomainName + a').addClass('hidden')
                if ($('.txtDomainName + a + .spnExists').length < 1) {
                    $('.txtDomainName + a').after('<span class="spnExists" style="color:red;">This domain already exists!</span>');
                }
            } else {
                $('.txtDomainName + a').removeClass('hidden');
                $('.txtDomainName + a + .spnExists').remove();
            }
        });
    });
} // end of checkDomain()

// setScrollerFrameWidth() - Sets the width of the sitemap's scrolling frame based on the number of levels in it.
function setScrollerFrameWidth() {
    if ($('#treeScrollerFrame').length > 0) {
        var oldWidth = $('.sitemapBreadcrumb').width();
        var width = 0;
        for (i = 0; i < $('.list.tree').length; i++) {
            var current = $('.list.tree:eq(' + i + ')')
            width += (current.width() * 1);
            width += (current.css('margin-left').substr(0, current.css('margin-left').length - 2) * 1);
            width += (current.css('margin-right').substr(0, current.css('margin-right').length - 2) * 1);
        }
        $('#treeScrollerFrame').css('width', width + 'px');
        if (width > 610) {
            $('.sitemapBreadcrumb').css('width', width + 'px');
        } else {
            $('.sitemapBreadcrumb').css('width', '610px');
        }
        if ($('.sitemapBreadcrumb').width() != oldWidth) {
            treeSliders('true');
        } else {
            treeSliders('false');
        }
    }
} // end of setScrollerFrameWidth()

// treeSliders() - Loads the js event handlers to control the treeScroller's sliders.
function treeSliders(forceSlide) {
    if (!forceSlide) { forceSlide = 'false'; }
    var sliderMargin = Boogaloo.dictionary.retrieve("sliderMargin");
    if (sliderMargin != null && forceSlide == 'false') {
        $('#treeScrollerFrame').css("margin-left", sliderMargin);
        $('.sitemapBreadcrumb').css("margin-left", sliderMargin);
    } else {
        var newMargin = "0px";
        if ($('#treeScrollerFrame').width() > $('#treeScroller').width()) {
            newMargin = ($('#treeScroller').width() - $('#treeScrollerFrame').width()) + 'px';
            $('#treeScrollerFrame').animate({ marginLeft: newMargin }, "slow");
            $('.sitemapBreadcrumb').animate({ marginLeft: newMargin }, "slow");
        } else {
            newMargin = "0px";
            $('#treeScrollerFrame').animate({ marginLeft: '0px' }, "slow");
            $('.sitemapBreadcrumb').animate({ marginLeft: '0px' }, "slow");
        }
        Boogaloo.dictionary.add('sliderMargin', newMargin, true);
    }
} // end of treeSliders()

// breadcrumbLoadSlide() - sets the breadcrumb to the proper sitemap level.
function breadcrumbLoadSlide() {
    var newMargin = "0px";
    if ($('.sitemapBreadcrumb').length > 0) {
        var width = 0;
        for (i = 0; i < $('.sitemapBreadcrumb li').length; i++) {
            var current = $('.sitemapBreadcrumb li:eq(' + i + ')')
            width += (current.width() * 1);
            width += (current.css('margin-left').substr(0, current.css('margin-left').length - 2) * 1);
            width += (current.css('margin-right').substr(0, current.css('margin-right').length - 2) * 1);
        }
        if (width > 610) {
            $('.sitemapBreadcrumb').css('width', width + 'px');
        } else {
            $('.sitemapBreadcrumb').css('width', '610px');
        }
        if ($('.sitemapBreadcrumb').width() > $('#sitemapBreadcrumbWrapper').width()) {
            newMargin = ($('#sitemapBreadcrumbWrapper').width() - $('.sitemapBreadcrumb').width()) + 'px';
            $('.sitemapBreadcrumb').animate({ marginLeft: newMargin }, "slow");
        } else if (($('#treeScrollerFrame').css('margin-left').substr(0, current.css('margin-left').length - 2) * 1) < 0) {
            newMargin = $('#treeScrollerFrame').css('margin-left');
            $('.sitemapBreadcrumb').css('width', $('#treeScrollerFrame').css('width'));
            $('.sitemapBreadcrumb').animate({ marginLeft: newMargin }, "slow");
        } else {
            newMargin = "0px";
            $('.sitemapBreadcrumb').animate({ marginLeft: '0px' }, "slow");
        }
    }
    Boogaloo.dictionary.add('sliderMargin', newMargin, true);
    sitemapTreeVerticalScrollButtons();
} // end of breadcrumbLoadSlide()

// Controls the vertical scrolling for the sitemap tree.
function sitemapTreeVerticalScrollButtons() {
    $('.scroll.up').die('click');
    $('.scroll.down').die('click');
    for (i = 0; i < $('.sitemap .list.tree').length; i++) {
        $('#treeScrollerFrame').append('<button type="button" class="scroll up">scroll up</button><button type="button" class="scroll down">scroll down</button>');
        x = (205 * i);
        $('.scroll.up:eq(' + i + ')').css({ 'left': x + 'px', 'top': 0 });
        $('.scroll.down:eq(' + i + ')').css({ 'left': x + 'px', 'top': '279px' });
        if ($('.sitemap .list.tree:eq(' + i + ') li').length < 10) {
            $('.scroll.up:eq(' + i + ')').addClass('null');
            $('.scroll.down:eq(' + i + ')').addClass('null');
        }
    }
    $('.scroll.up').live('click', function() {
        if ($('.sitemap .list.tree:eq(' + $('.scroll.up').index(this) + ') li').length > 10) {
            var list = $('.sitemap .list.tree li:first-child:eq(' + $('.scroll.up').index(this) + ')');
            listOffset = list.css('margin-top').substr(0, list.css('margin-top').length - 2) * 1;
            listOffset = listOffset + 260;
            if (listOffset >= 0) { listOffset = 0; }
            list.animate({ marginTop: listOffset + 'px' });
        }
    });
    $('.scroll.down').live('click', function() {
        if ($('.sitemap .list.tree:eq(' + $('.scroll.down').index(this) + ') li').length > 10) {
            var list = $('.sitemap .list.tree li:first-child:eq(' + $('.scroll.down').index(this) + ')');
            listOffset = list.css('margin-top').substr(0, list.css('margin-top').length - 2) * 1;
            listOffset = listOffset - 260;
            minList = ($('.sitemap .list.tree:eq(' + $('.scroll.down').index(this) + ') li').length * 26) * -1;
            if (listOffset <= minList) {
                listOffset = minList;
            }
            list.animate({ marginTop: listOffset + 'px' });
        }
    });
} // end of sitemapTreeVerticalScrollButtons()

// slideButtons() - Controls the horizontal sliding of the tree menu.
function slideButtons() {
    if ($('#treePrevious').length > 0) {
        $('#treePrevious').bind('click', function() {
            var oldMargin = ($('.sitemapBreadcrumb').css('margin-left').substr(0, $('.sitemapBreadcrumb').css('margin-left').length - 2) * 1);
            var newMargin = oldMargin + 205;
            if (newMargin > 0) {
                newMargin = 0;
            }
            newMargin = newMargin + 'px';
            $('.sitemapBreadcrumb').animate({ marginLeft: newMargin }, "slow", "linear");
            $('#treeScrollerFrame').animate({ marginLeft: newMargin }, "slow", "linear");
            Boogaloo.dictionary.add('sliderMargin', newMargin, true);
        });
    }
    if ($('#treeNext').length > 0) {
        $('#treeNext').bind('click', function() {
            var oldMargin = ($('.sitemapBreadcrumb').css('margin-left').substr(0, $('.sitemapBreadcrumb').css('margin-left').length - 2) * 1);
            var newMargin = oldMargin - 205;
            var minMargin = ($('.sitemapBreadcrumb').width() - $('#sitemapBreadcrumbWrapper').width()) * -1;
            if (newMargin < minMargin) {
                newMargin = minMargin;
            }
            newMargin = newMargin + 'px';
            $('.sitemapBreadcrumb').animate({ marginLeft: newMargin }, "slow");
            $('#treeScrollerFrame').animate({ marginLeft: newMargin }, "slow");
            Boogaloo.dictionary.add('sliderMargin', newMargin, true);
        });
    }
} // end of slideButtons()

// addANewPageLoad() - When the "Add a new page" button is clicked on the sitemap breadcrumb, the sitemap is closed.
function addANewPageLoad() {
    $('.sitemapBreadcrumb .add').live('click', function() {
        if ($('.sitemap').hasClass('opened')) {
            $('#treeScroller').slideToggle()
            setScrollerFrameWidth();
            $('.sitemap').removeClass('opened');
            Boogaloo.dictionary.add('openTree', "false", true);
        }
    });
} // end of addANewPageLoad()

// settingsInfoIcon()
function settingsInfoIcon() {
    for (i = 0; i < $('.settingCategory .inlineEdit > label').length; i++) {
        $('.settingCategory .inlineEdit > label:eq(' + i + ')').before("<button type='button' class='icon info'>&nbsp;</button>");
    }
    $('.settingCategory .icon.info').live('click', function() {
        var index = $('.settingCategory .icon.info').index(this);
        $('.settingCategory .help:eq(' + index + ')').toggleClass('show');
    });
} // end of settingsInfoIcon()